<template>
  <el-tooltip :open-delay="1000" :content="content" :disabled="!content">
    <el-link class="z-help "
             target="_blank"
             type="primary"
             v-bind="$attrs">
      <!-- <span class="z-help-name"> {{name}}</span> -->
    </el-link>
  </el-tooltip>

</template>

<script>
import ZIcon from '@/components/storybook/z-icon'
import ZTooltip from '@/components/storybook/z-tooltip'

export default {
  name: 'ZHelp',
  components: {
    ZIcon,
    ZTooltip
  },
  props: {
    name: {
      type: String,
      default: 'Get Help'
    },
    content: String
  }
}
</script>
<style lang="scss" scoped>
.z-help {
  text-decoration: none;
  ::v-deep .icon_help_circle {
    width: 14px;
    height: 14px;
    font-size: 14px;
    margin-right: 8px;
  }
  &--name {
    font-size: 14px;
  }
}
</style>
